﻿@{
    ViewBag.Title = " 兑礼网控制中心-网站设置";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<style>
    .fitem label {
        display: inline-block;
        margin-top: 10px;
        width: 110px;
    }

    .content-left {
        width: 50%;
        float: left;
    }

    .content-right {
        width: 50%;
        float: left;
        text-align: center;
        padding-top: 25px;
        /*overflow: auto;
        height: calc(100% - 25px);*/
    }

    #colorpanel {
        z-index: 10000 !important;
    }
</style>
<script src="~/Content/js/ajaxfileupload.js"></script>
<script src="~/Content/js/jquery.colorpicker.js"></script>

<div class="content-left">
    @*<div class="easyui-layout" style="width:100%;height:100%;">*@
    <div id="toolbar">
        <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-edit" plain="true" onclick="editpeizhi()">编辑</a>
    </div>
    <table id="dg" style="width: 100%;" class="easyui-datagrid" method="POST" url="@Url.Action("GetList", "Setting")" toolbar="#toolbar" pagination="true" rownumbers="true" fitcolumns="true" singleselect="true" autorowheight="true" resizable="true">
        <thead>
            <tr>
                <th field="TypeText">设置项名称</th>
                <th field="Url" formatter="formatterurl" width="50">值</th>
            </tr>
        </thead>
    </table>

</div>
<div id="dlg" modal="true" class="easyui-dialog" style="width:480px;height:400px;padding:10px 20px" closed="true" buttons="#dlg-buttons">
    <form id="fm" method="post">
        <input name="ID" hidden="hidden" value="0" />
        <input id="Url" name="Url" hidden="hidden" />
        <input name="Type" hidden="hidden" />
        @*<div class="fitem" style="width:100%;" id="typediv">
            <label>图片位置</label>*@
        @*<input id="Type" class="easyui-combobox" name="Type"
            data-options="valueField:'Key',textField:'Value',url:'@Url.Action("TypeEnumList", "Setting")'">*@
        @*<select id="Type" name="Type" class="easyui-combobox" style="width:150px;" required="true">
                @foreach (int item in Enum.GetValues(typeof(ExChange.Web.EnumHelper.UploadType)))
                {
                    <option value="@item">@(((ExChange.Web.EnumHelper.UploadType)item).ToString())</option>
                }
            </select>*@
        @*</div>*@
        <div class="fitem" style="width:100%;">
            <label>文件建议大小</label>
            <span id="chicun"></span>
        </div>
        <div class="fitem" style="width:100%;">
            <label>上传附件</label>
            <input name="fileUpLoad" id="fileUpLoad" type="file" onchange="ajaxFileUpload('fileUpLoad', 'fileList')" buttontext=" 选择文件" />
        </div>
        <div class="fitem" style="width:100%;">
            <label>已上传文件</label>
            <div id="fileList">

            </div>
        </div>
    </form>
</div>
<div id="dlg-radio" class="easyui-dialog" style="width:480px;height:400px;padding:10px 20px" closed="true" buttons="#dlg-buttons">
    <form id="fm3" method="post">
        <input name="ID" hidden="hidden" value="0" />
        <input name="Type" hidden="hidden" />
        @*<div class="fitem" style="width:100%;">
            <label>视频建议大小</label>
            <span>10M 1:2</span>
        </div>*@
        <div class="fitem" style="width:100%;">
            <label>选择类型:</label>
        </div>
        <div class="fitem" style="width:100%;">
            <input type="radio" name="Url" value="text" />文字
            <input type="radio" name="Url" value="video" />视频
        </div>
    </form>
</div>
<div id="dlg-text" class="easyui-dialog" style="width:480px;height:400px;padding:10px 20px" closed="true" buttons="#dlg-buttons">
    <form id="fm2" method="post">
        <input name="ID" hidden="hidden" value="0" />
        <input name="Type" hidden="hidden" />
        <div class="fitem" style="width:100%;">
            <label>选择颜色:</label>
            <img src="~/Content/images/colorpicker.png" id="cp3" style="cursor:pointer" />
        </div>
        <div class="fitem" style="width:100%;" id="typediv">
            <label>文本:</label>
            @*<textarea name="Url" rows="10" cols="50" id="wenbenyu"></textarea>
                <input name="Url" type="text" id="wenbenkuang" />*@
        </div>

    </form>
</div>
<div id="dlg-buttons">
    <a href="javascript:void(0)" class="easyui-linkbutton c6" iconcls="icon-ok" onclick="save()" style="width:90px">保存</a>
    <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-cancel" onclick="javascript: $('#dlg').dialog('close'); $('#dlg-text').dialog('close'); $('#dlg-radio').dialog('close');" style="width:90px">取消</a>
</div>
@*</div>*@
<div class="content-right">
    <iframe id="myiframe" border="0" frameborder="0" width="370" height="640" scrolling="no" src="/Wechat/Index?request=1"></iframe>
</div>
<script type="text/javascript">
    var s = "";
    function ajaxFileUpload(fileElementId, fileList) {
        var id = fileElementId;
        $.ajaxFileUpload({
            url: '/Home/UploadFile', //用于文件上传的服务器端请求地址
            secureuri: false, //是否需要安全协议，一般设置为false
            fileElementId: id, //文件上传域的ID
            dataType: 'json', //返回值类型 一般设置为json
            success: function (data, status)  //服务器成功响应处理函数
            {
                var html = "";
                $("#fileList").html("");
                $("#Url").val(data.data.path);
                html = "<img src=" + data.data.path + " style='max-width:60px;max-height:60px;margin-left:130px;'  />"
                $('#' + fileList).append(html);
            },
            error: function (data, status, e)//服务器响应失败处理函数
            {
                $.messager.alert("上传失败！");
            }
        })
    }

    //function newpeizhi() {
    //    //新增
    //    $('#dlg').dialog({
    //        title: '新增配置',
    //        width: 550,
    //        height: 350,
    //        closed: false,
    //        cache: false,
    //        modal: true
    //    }).dialog('center');
    //    $('#fm').form('clear');//清空表单
    //    //$('#fm').clearForm();//扩展清空表单
    //    $('#fileList').html("");
    //    $("#typediv").show();
    //}

    function save() {
        if (edittype == 0) {
            $('#fm').form('submit', {
                url: '/Setting/Save',
                onSubmit: function () {
                    return $(this).form('validate');
                },
                success: function (result) {
                    var result = eval('(' + result + ')');
                    if (result.success == true) {
                        $('#dlg').dialog('close');        // 关闭弹出框
                        $('#dg').datagrid('reload');    // 重新加载表数据
                        $('#myiframe').attr('src', $('#myiframe').attr('src'));
                    } else {
                        $.messager.alert('错误', '操作失败！');
                    }
                }
            });
        } else if (edittype == 1) {
            $('#fm3').form('submit', {
                url: '/Setting/Save',
                onSubmit: function () {
                    return $(this).form('validate');
                },
                success: function (result) {
                    var result = eval('(' + result + ')');
                    if (result.success == true) {
                        $('#dlg-radio').dialog('close');        // 关闭弹出框
                        $('#dg').datagrid('reload');    // 重新加载表数据
                        $('#myiframe').attr('src', $('#myiframe').attr('src'));
                    } else {
                        $.messager.alert('错误', '操作失败！');
                    }
                }
            });
        }
        else {
            $('#fm2').form('submit', {
                url: '/Setting/Save',
                onSubmit: function () {
                    return $(this).form('validate');
                },
                success: function (result) {
                    var result = eval('(' + result + ')');
                    if (result.success == true) {
                        $('#dlg-text').dialog('close');        // 关闭弹出框
                        $('#dg').datagrid('reload');    // 重新加载表数据
                        $('#myiframe').attr('src', $('#myiframe').attr('src'));
                    } else {
                        $.messager.alert('错误', '操作失败！');
                    }
                }
            });
        }
    }
    var edittype = 0;
    function editpeizhi() {
        $('#typediv').html("");
        var row = $('#dg').datagrid('getSelected');
        if (row) {
            if (row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.欢迎页Logo)') || row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.欢迎页按钮)') || row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.欢迎页欢迎图)') || row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.欢迎视频)')) {
                if (row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.欢迎页Logo)')) {
                    $("#chicun").html("655*91");
                }
                if (row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.欢迎页按钮)')) {
                    $("#chicun").html("277*154");
                }
                if (row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.欢迎页欢迎图)')) {
                    $("#chicun").html("640*577");
                }
                if (row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.欢迎视频)')) {
                    $("#chicun").html("10M 1:2");
                }
                edittype = 0;
                $("#fileList").html("");
                $('#fm').form('clear');
                $('#dlg').dialog({
                    title: '修改配置',
                    width: 550,
                    height: 350,
                    closed: false,
                    cache: false,
                    modal: true
                }).dialog('center');
                $('#fm').form('load', row);//表单赋值
                if (row.Url != null && row.Url != "") {
                    $("#fileList").append("<img src=" + row.Url + " style='max-width:60px;max-height:60px;margin-left:130px;'  />")
                }
                //$("#typediv").hide();
            } else if (row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.欢迎内容类型)')) {
                edittype = 1;
                $('#fm3').form('clear');
                $('#dlg-radio').dialog({
                    title: '修改配置',
                    width: 550,
                    height: 350,
                    closed: false,
                    cache: false,
                    //modal: true
                }).dialog('center');
                if (row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.页面颜色)')) {
                    var html = '<label>文本</label><input name="Url" type="text" id="wenbenkuang" />';
                    $("#cp3").show();
                    $('#typediv').append(html);
                }
                else {
                    $("#cp3").hide();
                    var html = '<label>文本</label><textarea name="Url" rows="10" cols="50" id="wenbenyu"></textarea>';
                    $('#typediv').append(html);

                }
                $('#fm3').form('load', row);
            } else {
                edittype = 2;
                $('#fm2').form('clear');
                $('#dlg-text').dialog({
                    title: '修改配置',
                    width: 550,
                    height: 350,
                    closed: false,
                    cache: false,
                    //modal: true
                }).dialog('center');
                if (row.Type == parseInt('@((int)ExChange.Web.EnumHelper.UploadType.页面颜色)')) {
                    var html = '<label>文本</label><input name="Url" type="text" id="wenbenkuang" />';
                    $("#cp3").show();
                    $('#typediv').append(html);
                }
                else {
                    $("#cp3").hide();
                    var html = '<label>文本</label><textarea name="Url" rows="10" cols="50" id="wenbenyu"></textarea>';
                    $('#typediv').append(html);

                }
                $('#fm2').form('load', row);
            }
        }
        else {
            $.messager.alert("警告", "请选择一条！");
        }
    }

    function formatterurl(val, row) {
        if (row.Type >= 1 && row.Type <= 3) {
            return val != null && val != "" ? '<img src=' + val + ' style="max-width:40px;max-height:20px;">' : "";
        } else if (row.Type == 4) {
            return "<div style='color:" + val + ";'>这个颜色</div>";
        }
        else {
            return val;
        }
    }


    $(function () {
        $("#cp3").colorpicker({
            fillcolor: true,
            success: function (o, color) {
                $("#wenbenkuang").val(color);
                $("#wenbenkuang").css("color", color);
            }
        });
    });

</script>